import 'package:flutter/material.dart';
import 'package:top_foundation/utils/ex/image.dart';
import 'package:top_foundation/utils/theme/button.dart';
import 'package:top_foundation/utils/theme/theme.dart';
import 'package:whale/helper/utils/wxMan.dart';

import '../../../helper/utils/httputils/urlpath.dart';
import '../../../helper/utils/util.dart';
import 'index.dart';
import 'widgets/code_field.dart';
import 'widgets/widgets.dart';

class LoginPage extends StatelessWidget {
  LoginPage({super.key});
  final controller = Get.put(LoginController());
  // 主视图
  Widget _buildView() {
    return ListView(
      padding: EdgeInsets.zero,
      children: [
        Container(
          height: 320.r,
          alignment: Alignment.topLeft,
          decoration: BoxDecoration(
            image: DecorationImage(
                image: loadImageProvider(
                  url: 'log_bg.png'.imgPathCommon,
                ),
                fit: BoxFit.cover),
          ),
          child: _title(),
        ),
        SizedBox(
          height: 1.sh - 320.r - 150.r,
          child: _content(),
        ),
        SizedBox(
          height: 150.r,
          child: Column(
            mainAxisAlignment: MainAxisAlignment.end,
            children: [
              Row(
                mainAxisAlignment: MainAxisAlignment.center,
                children: [
                  GestureDetector(
                    onTap: () {
                      Wxman().wxLogin();
                    },
                    child: Container(
                      decoration: BoxDecoration(
                        border: Border.all(color: ITheme.titleColor),
                        borderRadius: BorderRadius.circular(20.r),
                      ),
                      alignment: Alignment.center,
                      width: 40.r,
                      height: 40.r,
                      child: Image.asset(
                        'wx.png'.imgPathCommon,
                        color: ITheme.titleColor,
                        width: 20.r,
                        height: 20.r,
                      ),
                    ),
                  )
                ],
              ),
              SafeArea(
                top: false,
                child: ReadDealWidget(
                  actionAnimate: (p0) {
                    controller.state.readAnim = p0;
                  },
                  valueChanged: (value) {
                    controller.state.isReaded = value;
                  },
                ),
              ),
            ],
          ),
        ),
      ],
    );
  }

  Widget _content() {
    var state = controller.state;
    return Column(
      // padding: EdgeInsets.only(top: 320.r),
      children: [
        Listener(
          onPointerDown: (event) async {
            await Future.delayed(const Duration(milliseconds: 200));
            FocusScope.of(Get.context!).requestFocus(state.accNode);
          },
          child: UITextField(
            focusNode: state.accNode,
            margin: EdgeInsets.symmetric(horizontal: 30.r),
            title: '账号',
            hintText: '请输入账号',
            data: state.account,
            autoFocus: true,
            titleStyle: TextStyle(
              color: const Color(0xff333333),
              fontSize: 20.sp,
              fontWeight: FontWeight.bold,
            ),
            keyboardType: state.isPwdLogin ? null : TextInputType.phone,
            onChanged: (p0) {
              state.account = p0;
              if (state.accountError != null) {
                state.accountError = null;
                controller.update();
              }
            },
            style: TextFieldStyle.underLine,
            padding: EdgeInsets.zero,
            height: 50.r,
            // backgroundColor: Colors.amber,
          ),
        ),
        SizedBox(
          height: 20.r,
        ),
        state.isPwdLogin
            ? Listener(
                onPointerDown: (event) async {
                  await Future.delayed(const Duration(milliseconds: 200));
                  FocusScope.of(Get.context!).requestFocus(state.pwdNode);
                },
                child: LoginField(
                  focusNode: state.pwdNode,
                  controller: state.pwdCtrl,
                  title: '密码',
                  placeholder: '请输入密码',
                  padding: EdgeInsets.symmetric(horizontal: 30.r),
                  isPwd: true,
                  errText: state.pwdError,
                  titleColor: ColorsUtil.title,
                  onChange: (p0) {
                    if (state.pwdError != null) {
                      state.pwdError = null;
                      controller.update();
                    }
                  },
                ),
              )
            : Container(
                alignment: Alignment.centerLeft,
                margin: EdgeInsets.symmetric(horizontal: 30.r),
                // decoration: const BoxDecoration(
                //     border: Border(
                //         bottom:
                //             BorderSide(color: Color(0xffDFDFDF), width: 1))),
                child: Column(
                  crossAxisAlignment: CrossAxisAlignment.start,
                  children: [
                    Container(
                      alignment: Alignment.centerLeft,
                      child: Text(
                        '验证码',
                        style: TextStyle(
                          color: const Color(0xff333333),
                          fontSize: 20.sp,
                          fontWeight: FontWeight.bold,
                        ),
                      ),
                    ),
                    SizedBox(
                      height: 50.r,
                      child: ICodeField(
                        smsClickListener: () async {
                          return await controller.sendCode();
                        },
                        // isLineStyle: ,
                        errText: state.pwdError,
                        onChange: (p0) {
                          state.smCode = p0;
                          state.pwdError = null;
                          controller.update();
                        },
                      ),
                    ),
                  ],
                ),
              ),
        Row(
          mainAxisAlignment: MainAxisAlignment.start,
          children: [
            InkWell(
              onTap: () {
                controller.toForgetPwd();
              },
              child: Container(
                height: 40.r,
                alignment: Alignment.centerRight,
                margin: EdgeInsets.symmetric(horizontal: 30.r),
                child: Text(
                  '忘记密码了?',
                  style: TextStyle(
                    color: ColorsUtil.blue,
                    fontSize: 14.sp,
                  ),
                ),
              ),
            ),
          ],
        ),
        SizedBox(
          height: 20.r,
        ),
        InkWell(
          onTap: () {
            if (!state.isReaded) {
              var p0 = state.readAnim!;
              if (p0.isAnimating) {
                return;
              }
              p0.repeat();
              Future.delayed(const Duration(milliseconds: 600)).then((value) {
                p0.stop();
              });
            } else {
              controller.actionLogin();
            }
          },
          child: Container(
            margin: EdgeInsets.symmetric(horizontal: 30.r),
            height: 50.r,
            alignment: Alignment.center,
            decoration: BoxDecoration(
              color: ColorsUtil.blue,
              borderRadius: BorderRadius.circular(5.r),
            ),
            child: Text(
              '登录',
              style: TextStyle(
                color: Colors.white,
                fontSize: 17.sp,
              ),
            ),
          ),
        ),
        Row(
          mainAxisAlignment: MainAxisAlignment.spaceBetween,
          children: [
            InkWell(
              onTap: () {
                Get.toNamed(RouterPath.register);
              },
              child: Container(
                padding: EdgeInsets.only(left: 30.r),
                child: Text(
                  '立即注册',
                  style: TextStyle(
                    color: ColorsUtil.blue,
                    fontSize: 14.sp,
                  ),
                ),
              ),
            ),
            InkWell(
              onTap: () {
                state.isPwdLogin = !state.isPwdLogin;
                controller.update();
              },
              child: Container(
                height: 40.r,
                alignment: Alignment.centerRight,
                margin: EdgeInsets.only(right: 30.r),
                child: Row(
                  children: [
                    Icon(
                      Icons.swap_horizontal_circle,
                      color: ColorsUtil.blue,
                      size: 20.r,
                    ),
                    SizedBox(
                      width: 3.r,
                    ),
                    Text(
                      state.isPwdLogin ? '切换验证码登录' : '切换密码登录',
                      style: TextStyle(
                        color: ColorsUtil.blue,
                        fontSize: 14.sp,
                      ),
                    ),
                  ],
                ),
              ),
            ),
          ],
        ),
      ],
    );
  }

  Widget _title() {
    return SafeArea(
      child: Column(
        children: [
          Row(
            mainAxisAlignment: MainAxisAlignment.spaceBetween,
            crossAxisAlignment: CrossAxisAlignment.center,
            children: [
              Container(
                alignment: Alignment.centerLeft,
                margin: EdgeInsets.only(left: 30.r, top: 20.r),
                child: Text(
                  '欢迎登录',
                  style: TextStyle(
                    color: Colors.black,
                    fontSize: 30.sp,
                    fontWeight: FontWeight.bold,
                  ),
                ),
              ),
              if (UrlPath.isDebug)
                InkWell(
                  onTap: () {
                    UrlPath.setBaseUrl(isTest: !UrlPath.isTest);
                    controller.update();
                  },
                  child: Container(
                    padding: EdgeInsets.only(right: 20.r),
                    child: Row(
                      children: [
                        Text(
                          UrlPath.isTest ? '测试环境' : '正式环境',
                          style: const TextStyle(color: ColorsUtil.blue),
                        ),
                        Icon(
                          Icons.swap_horizontal_circle,
                          color: ColorsUtil.blue,
                          size: 20.r,
                        ),
                      ],
                    ),
                  ),
                ),
            ],
          ),
        ],
      ),
    );
  }

  @override
  Widget build(BuildContext context) {
    return GetBuilder<LoginController>(
      builder: (_) {
        return PopScope(
            canPop: false,
            child: Scaffold(
              backgroundColor: Colors.transparent,
              body: _buildView(),
            ));
      },
    );
  }
}
